<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="js/jquery.js"></script>
    <style>
        h1 {
            font-weight: bold;
            font-size: 28px;
        }

        tr {
            font-weight: bold;
            background-color: white;
        }

        a {
            text-decoration: none;
        }

        body {
            text-align: left;
            width: 800px;
            height: 600px;
        }
    </style>
</head>
<body>

<h1>添加演唱会信息</h1>
<form method="post" action="add">
    <table>
        <tr>
            <td>演唱会名称：<input type="text" name="concertName" id="concertName" placeholder="请输入演唱会名称"
                                  onblur="checkConcertName()"></td>
        </tr>
        <tr>
            <td> 价格：<input type="text" name="price" id="price" placeholder="请输入价格"></td>
            </td>
        </tr>
        <tr>
            <td> 是否推荐：
                <input type="radio" name="recommend" value="1" checked>是
                <input type="radio" name="recommend" value="0">否
            </td>
        </tr>
        <tr>
            <td> 城市：<input type="text" name="city" id="city" placeholder="请输入城市"></td>
        </tr>
        <tr>
            <td> 详细地址：<input type="text" name="address" id="address" placeholder="请输入详细地址"></td>
        </tr>
        <tr>
            <td> 开始时间：<input type="date" name="startTime" id="startTime"></td>
        </tr>
        <tr>
            <td><input type="submit" value="添加">
                <input type="button" value="返回" onclick="history.back()"></td>
        </tr>

    </table>


</form>


<script>
    function checkConcertName() {
        $.get("checkConcertName", {concertName: $("#concertName").val()}, res => {
            if (res > 0) {
                alert('该演唱会已存在')
            }
        })
    }

    $(res => {
        $("form").submit(res => {
            let concertName = $("#concertName").val();
            if (concertName === '') {
                alert('演唱会名称不能为空')
                return false;
            }
            let price = $("#price").val();
            if (price === '') {
                alert('价格不能为空')
                return false;
            }
            let recommend = $("input[name='recommend']:checked").val();
            let city = $("#city").val();
            if (city === '') {
                alert('城市不能为空')
                return false;
            }
            let address = $("#address").val();
            if (address === '') {
                alert('详细地址不能为空')
                return false;
            }
            let startTime = $("#startTime").val();
            if (startTime === '') {
                alert('开始时间不能为空')
                return false;
            }
            var reg = /^\d{4}-\d{2}-\d{2}$/
            if (!reg.test(startTime)) {
                alert('开始时间格式不正确')
                return false;
            }


        })
    })
</script>
</body>
</html>
